﻿
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Cache-Control" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title></title>
    <!-- Bootstrap -->
    <link rel="stylesheet" type="text/css" href="/ViewV5/CSS/bootstrap3.3.5/css/bootstrap.css">
    <link href="/ViewV5/CSS/BootOver.css?v=1" rel="stylesheet" />
    <link rel="stylesheet" href="/ViewV5/CSS/icfont_qj/iconfont.css">
    <link href="/ViewV5/JS/chosen/chosen.css" rel="stylesheet" />

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script src="/ViewV5/JS/jquery-1.11.2.min.js"></script>
    <script src="/ViewV5/JS/jquery-migrate-1.1.0.min.js"></script>
    <script src="/ViewV5/JS/layer/layer.js"></script>
    <script src="/ViewV5/JS/avalon1.5.js"></script>
    <script src="/ViewV5/CSS/bootstrap3.3.5/js/bootstrap.js"></script>
    <script src="/ViewV5/JS/SZHLCommon.js?jsver=20160925"></script>
    <script src="/ViewV5/JS/ADDJS.js?ver=20170327"></script>
    <script src="/ViewV5/JS/chosen/chosen.jquery.min.js"></script>

    <style>
        #tab.table > thead > tr > th, #tab.table > tbody > tr > th, #tab.table > tfoot > tr > th, #tab.table > thead > tr > td, #tab.table > tbody > tr > td, #tab.table > tfoot > tr > td {
            vertical-align: middle;
            text-align: center;
        }

        .default-tab input, .default-tab select {
            border: none;
            box-shadow: none !important;
        }

        a .iconfont {
            margin-right: 5px;
            font-size: 12px;
        }
    </style>
</head>
<body>
    <div class="form-horizontal" ms-controller="ZXMX">
        <h3 style="text-align:center">{{MXData.dwname}}--{{JHData.JHTitle}}执行明细</h3>

        <div style="margin: 20px;">
            <div class="default-tab ft14 pt20">
                <table class="table table-hover table-bordered">

                    <tbody>
                        <tr>
                            <td class="text-right">项目期别</td>
                            <td>{{MXData.Remark1}}-{{MXData.Remark2}}</td>
                            <td class="text-right">计划属性</td>
                            <td>{{MXData.FLName}}</td>
                            <td class="text-right">合同编号</td>
                            <td>{{MXData.htbh}}</td>

                        </tr>
                        <tr>
                            <td class="text-right">合同名称</td>
                            <td>{{MXData.htnr}}</td>
                            <td class="text-right">当月计划(元)</td>
                            <td>{{MXData.je1}}</td>
                            <td class="text-right">当月计划描述</td>
                            <td>{{MXData.je1dec}}</td>
                        </tr>
                        <tr>
                            <td class="text-right">对方单位</td>
                            <td>{{MXData.dfdw}}</td>
                            <td class="text-right">付款一览表金额</td>
                            <td>{{MXData.ylbje}}</td>
                            <td style="text-align:right">计划状态</td>
                            <td style="text-align:left">
                                <div class="form-check checkbox-slider--b-flat">
                                    <label>
                                        <input type="checkbox" id="zxzt" ms-click="upzxzt()"><span>已执行</span>
                                    </label>
                                </div>
                            </td>
                        </tr>
                    </tbody>

                </table>
            </div>


            <div class="default-tab ft14 pt20">
                <table class="table table-hover table-bordered" id="tab">
                    <thead style="background:#f7f7f7;">
                        <tr>
                            <th width="50px">序号</th>
                            <th width="100px">结算方式</th>
                            <!--<th width="100px">银行</th>-->
                            <th width="80px">金额(元)</th>
                            <th width="100px">收支日期</th>
                            <!--<th width="100px">票据号码</th>-->
                            <th width="100px">备注</th>

                            <th width="50px">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr ms-repeat-item="ZXData">
                            <td>{{$index+1}}</td>
                            <td>{{item.jsfs}}</td>
                            <!-- <td>{{item.jrjg}}</td>-->
                            <td>{{item.jsje}}</td>
                            <td>{{item.szdate|date('yyyy-MM-dd')}}</td>
                            <!--<td>{{item.pjh}}</td>-->
                            <td style="word-break: break-all">{{item.remark}}</td>
                            <td><a ms-if="JHData.JHStatus=='0'&&MXData.status=='8'" class=" btn btn-danger btn-sm" ms-click="Del(item)"><i class="iconfont icon-shanchu"></i>删除</a></td>
                        </tr>
                    </tbody>
                    <tfoot>
                        <tr>
                            <td style="text-align:right;font-weight:bold">
                                合计：
                            </td>
                            <td style="font-weight:bold">{{zje}}</td>
                            <td colspan="4"></td>

                        </tr>
                        <tr ms-if="JHData.JHStatus=='0'&&MXData.status=='8'">
                            <td></td>
                            <td>
                                <select ms-duplex="ZXMX.jsfs" class="form-control">
                                    <option ms-repeat-item="JSData" ms-attr-value="item.TypeName">{{item.TypeName}}</option>
                                </select>
                            </td>
                            <!--  <td>
                                 <select ms-duplex="ZXMX.jrjg" class="form-control">
                                     <option value="">请选择金融机构</option>
                                     <option ms-repeat-item="YHData" ms-attr-value="item.TypeName">{{item.TypeName}}</option>
                                 </select>
                             </td>-->
                            <td><input type="text" class="form-control" ms-duplex="ZXMX.jsje" placeholder="请输入金额" /></td>
                            <td><input type="text" class="form-control szhl_form_date" ms-duplex="ZXMX.szdate" placeholder="请选择收支日期" /></td>
                            <!--<td>
                                <input type="text" class="form-control" ms-duplex="ZXMX.pjh" placeholder="请输入票据号" />
                            </td>-->
                            <td><input type="text" class="form-control" ms-duplex="ZXMX.remark" placeholder="请输入备注" /></td>
                            <td><a class="btn btn-info  btn-sm" ms-click="AddZXMX()"><i class="iconfont icon-jiahao"></i>执行付款</a></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>

    <script>
        var tempmodel = avalon.define({
            $id: "ZXMX",
            name: "执行明细",
            jhid: ComFunJS.getQueryString("JHID", "0"),
            mxid: ComFunJS.getQueryString("MXID", "0"),
            JHData: {},
            MXData: {},
            ZXData: [],
            JSData: [],
            YHData: [],
            ZXMX: { jsfs: "银行", jrjg: "", jsje: "0", szdate: "", pjh: "", remark: "", JHID: ComFunJS.getQueryString("JHID", "0"), szid: ComFunJS.getQueryString("MXID", "0") },
            zje: 0,
            upzxzt: function () {
                $.post("/API/VIEWAPI.ashx?ACTION=ZCZX_UPZXZT", { P1: tempmodel.mxid, P2: $("#zxzt").prop("checked")?"Y":"N" }, function (result) {
                    if (result.ErrorMsg == "") {
                        ComFunJS.winsuccess("操作成功");
                    }
                });
            },
            AddZXMX: function () {
                $.post("/API/VIEWAPI.ashx?ACTION=ZCZX_ADD", { P1: JSON.stringify(tempmodel.ZXMX.$model) }, function (result) {
                    if (result.ErrorMsg == "") {
                        ComFunJS.winsuccess("操作成功");
                        tempmodel.ZXData.push(result.Result)
                    }
                });
            },
            Del: function (item) {
                ComFunJS.winconfirm("确认要删除该执行吗", function () {
                    $.post("/API/VIEWAPI.ashx?Action=ZCZX_DEL", { P1: item.ID }, function (resultData) {
                        if (resultData.ErrorMsg == "") {
                            tempmodel.ZXData.remove(item);
                            ComFunJS.winsuccess("操作成功");
                        }
                    })
                }, function () { })
            }


        });
        avalon.ready(function () {
            ComFunJS.initForm();
            $.getJSON('/API/VIEWAPI.ashx?Action=ZCZX_GETZXINITDATA', { P1: tempmodel.jhid, P2: tempmodel.mxid }, function (resultData) {
                if (resultData.ErrorMsg == "") {
                    tempmodel.JHData = resultData.Result;
                    tempmodel.MXData = resultData.Result1;
                    tempmodel.ZXData = resultData.Result2;
                    tempmodel.JSData = resultData.Result3;
                    tempmodel.YHData = resultData.Result4;
                    setTimeout("ComFunJS.initForm()", 500)
                    tempmodel.ZXMX.jsje = tempmodel.MXData.je1 - tempmodel.zje;
                    if (tempmodel.MXData.status == "9") {
                        $("#zxzt").prop("checked", true);
                    }

                }
            })

        })
        tempmodel.$watch("ZXData.length", function (a) {
            tempmodel.zje = 0;
            tempmodel.ZXData.forEach(function (item) {
                tempmodel.zje = tempmodel.zje + item.jsje * 1;
            })
        })
    </script>
</body>
</html>